@extends('home.parent')
@section('title','我的客户列表')
@section('head_js')
@endsection
@section('head_css')
    <link rel="stylesheet" href="{{ asset('/css/dataTables.bootstrap.css') }}">
    <link rel="stylesheet" href="{{ asset('/css/select2/select2.min.css') }}">
    <style type="text/css">
        .select2-container .select2-selection--single{
            height:34px;
            line-height: 34px;
            border: 1px solid #D2D6DE;
            border-radius: 1px;
        }
    </style>
@endsection
@section('content')
    <div class="content-wrapper">
        <section class="content">
            <div class="row">
                <div class="col-xs-12">
                    <div class="box">
                        <div class="box-header">
                            <div class="form-inline pull-left">
                                <fieldset>
                                    <div class="input-group input-group-sm" >
                                        <span class="input-group-addon"><strong>编号</strong></span>
                                        <input type="text" style="width: 100px;" class="form-control" id="search_user_id">
                                    </div>
                                    <div class="input-group input-group-sm">
                                        <span class="input-group-addon"><strong>用户类型</strong></span>
                                        <select class="form-control select2" style="width: 120px;" id="search_user_type">
                                            <option value="-1">用户类型</option>
                                            <option value="0">普通用户</option>
                                            <option value="1">会员</option>
                                            <option value="2">分享嘉宾</option>
                                        </select>
                                    </div>
                                    <div class="input-group input-group-sm" >
                                        <span class="input-group-addon"><strong>昵称</strong></span>
                                        <input type="text" style="width: 100px;" class="form-control" id="search_nick_name">
                                    </div>
                                    <div class="input-group input-group-sm" >
                                        <span class="input-group-addon"><strong>姓名</strong></span>
                                        <input type="text" style="width: 100px;" class="form-control" id="search_real_name">
                                    </div>
                                    <div class="input-group input-group-sm" >
                                        <span class="input-group-addon"><strong>手机号</strong></span>
                                        <input type="text" style="width: 100px;" class="form-control" id="search_mobile">
                                    </div>
                                    <div class="input-group input-group-sm">
                                        <div class="input-group-btn" >
                                            <button type="button" class="btn btn-primary" onclick="searchData()"><i class="fa fa-search"></i></button>
                                        </div>
                                    </div>
                                </fieldset>
                            </div>
                        </div>
                        <!-- /.box-header -->
                        <div class="box-body">
                            <table id="data_list" class="table table-bordered table-striped">
                                <thead>
                                <tr>
                                  <th>编号</th>
                                  <th>头像</th>
                                  <th>用户类型</th>
                                  <th>昵称</th>
                                  <th>真实姓名</th>
                                  <th>销售</th>
                                  <th>客服</th>
                                  <th>手机号码</th>
                                  <th>会员到期时间</th>
                                  <th>付费用户</th>
                                  <th>分配时间</th>
                                </tr>
                                </thead>
                                <tbody>
                                </tbody>
                                <tfoot>
                                <tr>
                                  <th>编号</th>
                                  <th>头像</th>
                                  <th>用户类型</th>
                                  <th>昵称</th>
                                  <th>真实姓名</th>
                                  <th>销售</th>
                                  <th>客服</th>
                                  <th>手机号码</th>
                                  <th>会员到期时间</th>
                                  <th>付费用户</th>
                                  <th>分配时间</th>
                                </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>
@endsection
@section('foot_js')
<script src="{{ asset('/js/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('/js/dataTables.bootstrap.min.js') }}"></script>
<script src="{{ asset('/js/jquery.slimscroll.min.js') }}"></script>
<script src="{{ asset('/js/fastclick.js') }}"></script>
<script src="{{ asset('/js/tools.js').'?v='.env('VERSION') }}"></script>
<script src="{{ asset('/css/select2/select2.full.min.js') }}"></script>
<script>
  var list_ajax;
  var admin_id = "{{ $admin_id }}";
  $(function () {
    $(".select2").select2();
    //提示信息
    var lang = puppet.langShow();
    //初始化表格
    list_ajax = $("#data_list").dataTable({
      language:lang,  //提示信息
      autoWidth: false,  //禁用自动调整列宽
      stripeClasses: ["odd", "even"],  //为奇偶行加上样式，兼容不支持CSS伪类的场合
      processing: true,  //隐藏加载提示,自行处理
      serverSide: true,  //启用服务器端分页
      searching: false,  //禁用原生搜索
      orderMulti: false,  //启用多列排序
      order: [[0,'desc']],  //取消默认排序查询,否则复选框一列会出现小箭头
      renderer: "bootstrap",  //渲染样式：Bootstrap和jquery-ui
      pagingType: "simple_numbers",  //分页样式：simple,simple_numbers,full,full_numbers
      columnDefs: [
        {
          "targets": [1,2,3,4,5,6,7,8,9,10],  //列的样式名
          "orderable": false    //包含上样式名‘nosort’的禁止排序
        },
        {
          targets: 1,
          data: "img",
          title: "头像",
          render: function (data, type, row, meta) {
            return "<img src='"+data+"' class='icon_img_css' />";
          }
        },
        {
          targets: 2,
          data: "user_type",
          title: "用户类型",
          render: function (data, type, row, meta) {
            var user_type = '';
            switch(data){
              case 0:
                user_type = '普通用户';
                break;
              case 1:
                user_type = '会员';
                break;
              case 2:
                user_type = '分享嘉宾';
                break;
            }
            return user_type;
          }
        },
        {
          targets: 5,
          data: "sale_name",
          title: "销售",
          render: function (data, type, row, meta) {
            if(data == ''){
              if(row.sale_today){
                return  "<a href='javascript:;' onclick='setMyService("+row.user_id+",2)'>设置为我的客户</a>";
              }else{
                return '';
              }
            }else{
              return data;
            }
          }
        },
        {
          targets: 8,
          data: "deadline_time",
          title: "会员到期时间",
          render: function (data, type, row, meta) {
            return (data > 0) ? puppet.formatDateTime(data*1000) : '';
          }
        },
        {
          targets: 9,
          data: "is_pay",
          title: "付费用户",
          render: function (data, type, row, meta) {
            return (data == 1) ? '是' : '否';
          }
        },
        {
          targets: 10,
          data: "create_time",
          title: "分配时间",
          render: function (data, type, row, meta) {
            return data.substr(0, 10);
          }
        },
      ],
      ajax: function (data, callback, settings) {
        //封装请求参数
        var param = {};
        param.limit = data.length;//页面显示记录条数，在页面显示每页显示多少项的时候
        param.start = data.start;//开始的记录序号
        param.page = (data.start / data.length)+1;//当前页码
        param.order = data.order;
        param.search = data.search;
        param.admin_id = {{ $admin_id }};
        param.user_id = $.trim($('#search_user_id').val());
        param.user_type = $('#search_user_type').val();
        param.nick_name = $.trim($('#search_nick_name').val());
        param.real_name = $.trim($('#search_real_name').val());
        param.mobile = $.trim($('#search_mobile').val());
        param.ispay = $.trim($('#search_ispay').val());
        $.ajax({
          type: "POST",
          url: '{{ URL('admin/random/user/list/ajax') }}',
          cache: false,  //禁用缓存
          data: param,   //传入组装的参数
          dataType: "json",
          success: function (result) {
            var returnData = {};
            returnData.draw = data.draw;//这里直接自行返回了draw计数器,应该由后台返回
            returnData.recordsTotal = result.total;//返回数据全部记录
            returnData.recordsFiltered = result.total;//后台不实现过滤功能，每次查询均视作全部结果
            returnData.data = result.data;//返回的数据列表
            callback(returnData);
          }
        });
      },
      //列表表头字段
      columns: [
        {"data":"user_id"},
        {"data":"head_img"},
        {"data":"user_type"},
        {"data":"nick_name"},
        {"data":"real_name"},
        {"data":"sale_name"},
        {"data":"service_name"},
        {"data":"mobile"},
        {"data":"deadline_time"},
        {"data":"is_pay"},
        {"data":"create_time"},
      ],
      "fnDrawCallback":function(){
        $("#data_list_paginate").children('ul').append("<li style='margin-left:5px;'>&nbsp;&nbsp;<label style='margin-top:-5px;'>到第</lable>&nbsp;<input style='width:40px;hidden:none' class='margin text-center' id='changePage' type='text'>&nbsp;&nbsp;<label>页</lable>&nbsp;</li> <li style='margin-left:5px;float:right;' class='paginate_button'><a style='margin-bottom:5px' href='javascript:void(0);'id='dataTable-btn'>确认</a></li>");
        var oTable = $("#data_list").dataTable();
        $('#dataTable-btn').click(function(e){
          if($("#changePage").val() && $("#changePage").val() > 0) {
            var redirectpage = $("#changePage").val() - 1;
          }else{
            var redirectpage = 0;
          }
          oTable.fnPageChange(redirectpage);
        });
      },
    }).api();
  });
  function searchData(){
    $("#data_list").dataTable().fnDraw(false);
  }

  function setMyService(user_id){
    var url = "{{ URL('admin/set/my/service/ajax') }}";
    var data = {user_id:user_id};
    var result = puppet.myajax('post',url,data,false);
    if(result.code == 1){
      puppet.mesFailure(result.msg);
      return false;
    }else{
      puppet.mesSuccess(result.msg);
      location.reload();
    }
  }
</script>
@endsection